AJAX - Índice de Assuntos
Idioma, Language, Langue, Lingua, Sprache, 言語, Lugha, Tongue, Speech, 언어. Home

Importante :

1-O request só pode ser enviado para uma página local de um servidor.

2-É proibido acessar sites externos ao servidor pelo request.

3-Se você esta usando um servidor as urls podem ser relativas ao site mas se forem páginas sem um servidor as urls tem que ser absolutas, ou seja, com as pastas de onde o arquivo se encontra. Contudo, devido a politica de segurança do sistema operacional uma página web qualquer não pode acessar um arquivo local na máquina e por este motivo a requisição ajax dará erro de segurança por acesso negado.

Na caixa abaixo deverá aparecer os dados do arquivo 02-dados1.json,02-dados2.json,02-dados3.json assim que o botão acima da caixa for pressionado.
O dado recebido será exibido exatamente como foi enviado pelo servidor, sem qualquer tratamento.



Meus Animais de Estimação


Código

<script>
     var request = false;
     try {
         request = new XMLHttpRequest();
     } catch (trymicrosoft) {
         try {
             request = new ActiveXObject("Msxml2.XMLHTTP");
         } catch (othermicrosoft) {
             try {
                 request = new ActiveXObject("Microsoft.XMLHTTP");
             } catch (failed) {
                 request = false;
             }
         }
     }

     if (!request)
         alert("Erro ao inicializar o XMLHttpRequest!");

     function ObterPag1() {
         var url = "02-dados1.json";
         request.open("GET", url, true);
         request.onreadystatechange = updatePage;
         request.send(null);
     }

     function ObterPag2() {
         var url = "02-dados2.json";
         request.open("GET", url, true);
         request.onreadystatechange = updatePage;
         request.send(null);
     }

     function ObterPag3() {
         var url = "02-dados3.json";
         request.open("GET", url, true);
         request.onreadystatechange = updatePage;
         request.send(null);
     }

     function updatePage() {
         if (request.readyState == 4) {        /* navigation completed */
             if (request.status == 200) {    /* 0 = erro */
                 var response = request.responseText;
                 document.getElementById("Texto").value = response;
             } else
                 alert("Erro de acesso"); // + request.status vem sempre zero quando dá erro
             //alert("o texto de retorno é " + request.responseText);
         }
     }

 </script>

<div align="center">
                <button type="button" class="btn btn-primary" onClick="ObterPag1();">Página 1</button>
                <button type="button" class="btn btn-primary" onClick="ObterPag2();">Página 2</button>
                <button type="button" class="btn btn-primary" onClick="ObterPag3();">Página 3</button>
</div>

Os arquivos 02-dados1.json, 02-dados2.json e 02-dados3.json são exibidos na integra no box central da tela, como se fossem txt comum.